/**
  author : sailing
  date : 2016-10-21
  fun: button
***/

<style lang="less">
  .vx-panel-tip{
      min-width:100px;
      background:#f7f7f7;
      z-index:8000;
      top:80px;
      padding:0 10px 0 10px;
      min-height:30px;
      line-height:30px;
      box-shadow: 1px 2px 2px #ccc;
      border-radius:10px;
      position:absolute;
      
  }
</style>

<template>

  <transition name="fadeIn">
  <div v-show="isShow">
    <div class="vx-panel-tip" v-show="isShow" v-bind:style="{left: left + 'px', top: top + 'px'}">
      <ul>
        <li>
          <label>起点设备:</label>{{source}}<span></span>
        </li>
        <li>
          <label>起点端口:</label>{{s_port}}<span></span>
        </li>
        <li>
          <label>终点设备:</label><span>{{target}}</span>
        </li>
        <li>
          <label>终点端口:</label><span>{{e_port}}</span>
        </li>
      </ul>
    </div>
  </div>
  </transition>
</template>

<script>
import eventBus from '../../eventBus'
import tools from '../../server/tools'
export default {
  data () {
    return {
      isShow: false,
      left: 10,
      top: 400,
      s_port: '',
      e_port: '',
      source: '',
      target: '',
      list: { 
      },
      radio: ''
    }  
  },
  methods: {
  },
  mounted () {
    const that = this
    eventBus.bus.$on('mouseMove', function (param) {
      var e = param.event
      that.left = e.pageX + 5
      that.top = e.pageY + 5
    })
    eventBus.bus.$on('showHideEdgesTip', function (param) {
      that.isShow = param.show
      try {
        var data = param.vm.data()
        var sd = tools.getNode(dataJson.nodes, data.source)
        var teg = tools.getNode(dataJson.nodes, data.target)
        console.log('teg sd:', teg, sd)
        that.s_port = data.s_port
        that.e_port = data.e_port
        that.source = teg.label
        that.target = sd.label
      } catch (e) {
        console.log('e:', e)
      }
    })
  },
  props: {
    bg: String,
    text: String
  },
  components: {}
}
</script>